<template>
  <div id="operateBox" class="operateBox">
    <span>
      <el-link
        type="primary"
        @click="click(item)"
        v-for="(item, index) of showData"
        :key="index"
        >{{ item.name }}</el-link
      >
    </span>
    <el-dropdown v-if="hideData.length > 0" class="elDropdownBox">
      <span class="el-dropdown-link">
        更多<i class="el-icon-arrow-down el-icon--right"></i>
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item
          v-for="(item, index) of hideData"
          :key="index"
          @click.native="click(item)"
          >{{ item.name }}</el-dropdown-item
        >
      </el-dropdown-menu>
    </el-dropdown>
  </div>
</template>
<script>
// getFun：

// getFun(val){
//       this[val.fun](val.rowData);
//     },

// operateList，操作列
// this.operateList = [
//             {name:"查看详情",fun:"viewReading",buttonLimits:["policyNotice:detail1","inforList:detail"]},
//             {name:"删除",fun:"deleteHandle",buttonLimits:["policyNotice:delete","inforList:delete"]},
//             {name:"查看详情2",fun:"viewReading",buttonLimits:["policyNotice:detail1","inforList:detail"]},
//             {name:"删除2",fun:"deleteHandle",buttonLimits:["policyNotice:delete","inforList:delete"]},
//         ] ;
// this.operateList = this.getUserPermissionList(this.operateList);

export default {
  data() {
    return {
      showData: [],
      hideData: [],
      num: 2,
    }
  },
  props: {
    rowData: {
      type: Object,
      default: function () {
        return {}
      },
    },
    operateList: {
      type: Array,
      default: function () {
        return []
      },
    },
    index: {
      type: String,
    },
  },
  mounted() {
    this.$nextTick(function () {
      if ($('#operateBox').children().length < 1) {
        $('.operateBox').html('--')
      }
    })
  },
  computed: {},
  created() {
    this.showData = this.operateList.slice(0, this.num)
    this.hideData = this.operateList.slice(this.num, this.operateList.length)
  },
  methods: {
    click(item) {
      item.rowData = this.rowData
      item.index = this.index
      this.$emit('getFun', item)
    },
  },
}
</script>
<style scoped lang="less">
.el-dropdown-link {
  color: #409eff;
  cursor: pointer;
}
.elDropdownBox {
  margin-left: -5px;
}

.el-dropdown-menu .el-dropdown-menu__item {
  line-height: 26px;
}

.operateBox .el-link.el-link--primary {
  margin-right: 12px;
}
</style>
